
<!DOCTYPE html>
<script type="text/javascript" src="/static/js/jquery-3.5.1.min.js"></script>
<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css"/>
<script type="text/javascript"src="/static/layui/layui.js"></script>

<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script type="text/javascript">

    function tologin() {
        location.href="/user/toLogin";
    }
    function checkName() {
        var nameValue = $("#nameTxt").val();
        $.ajax({
            url : "/user/checkName",
            type : "post",
            data : "userName=" + nameValue,
            success : function(result) {
                if (result == 1) {

                } else {
                    alert("用户名已存在");
                    location.href = "/user/toReg";
                }
            }
        });
    }
    function totest() {
        location.href="/user/upLoadImg";
    }
</script>
<body background="/static/img/beijing1.jpeg" style="background-repeat: no-repeat; background-size: 100% 100%; background-attachment: fixed;">
<div  style="margin-top: 5%; margin-left: 95%;">
    <button type="button" class="layui-btn layui-btn-normal">
        <a onclick="tologin()">返回登录</a>

    </button>
    <a onclick="totest()">测试</a>
</div>
<div  style="margin-top: 10%; margin-left: 35%;">
    <form class="layui-form" id="regform">

        <div class="layui-form-mid layui-word-aux"></div>

        <div class="layui-form-item">
            <label class="layui-form-label">头像上传</label>
            <div class="layui-input-inline">
                <button type="button" class="layui-btn" id="uploadTest">
                    <i class="layui-icon">&#xe67c;</i>上传头像
                </button>
                <p>请耐心等待上传结果</p>
            </div>

        </div>
        <div class="layui-form-item">

            <div class="layui-input-inline">
                <input type="hidden" name="userImg" id="userImg"
                       value="${img}">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">用户名</label>
            <div class="layui-input-inline">
                <input type="text" name="userName" required lay-verify="required"
                       id="nameTxt" onblur="checkName()" placeholder="请输入用户名"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密码</label>
            <div class="layui-input-inline">
                <input type="password" name="passWord" required
                       lay-verify="required" placeholder="请输入密码" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">确认密码</label>
            <div class="layui-input-inline">
                <input type="password" name="confirmPassWord" required
                       lay-verify="required" placeholder="请输入确认密码" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">QQ</label>
            <div class="layui-input-inline">
                <input type="text" name="email" required lay-verify="required"
                       placeholder="请输入邮箱" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">生日</label>
            <div class="layui-input-inline">
                <input type="date" name="birth" required lay-verify="required"
                       placeholder="请输入生日" autocomplete="off" class="layui-input">
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo"
                        onclick="reg()">立即注册</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>
<script>
    layui.use('upload', function() {
                var upload = layui.upload;
                //执行实例
                var uploadInst = upload.render({
                        elem : '#uploadTest', //绑定元素
                        url : '/user/uploadFile', //上传接口
                        done : function(res) {
                            if (res.code == 0) {
                                var img = res.data;
                                document.getElementsByName("userImg")[0].value = img;
                                return layer.msg('上传成功');
                            }
                            //res   :json 对象   ，对象名.属性名获取图片的地址信息    img/head.jpg
                        },
                        error : function() {
                            //请求异常回调
                        }
                    });

            });
</script>
 </body>
</html>